The Backdrop


CSA Ocean Sciences Inc. (CSA) is a marine environmental consulting firm, CSA specializes in multidisciplinary projects concerning potential environmental impacts of activities throughout the world and offers a wide variety of desktop and field survey services.

Project Goals


OceanSound hired OST create a new interface and unique concept design. OceanSound asked us to develop an interactive and user friendly website that allowed users to know about ocean levels.

Our Offerings


We worked one-on-one with our client, and gained valuable insight about their needs, goals, and typical clients. This helped us develop an effective a customer journey map, which our exerts used to prepare a customized concept design.

Once the design was approved, we began to focus on UI/UX (User Interface) development. We divided the OceanSound design into 5 zones to create an interactive, fun, and informative design. Each zone shows a layer of the ocean, has its own unique animation, and is linked with a popup window that shares facts about the layer.

Each zone can be easily managed by Backend or Admin Panel

Challenges


  • We had to successfully develop a unique Joomla Gantry 5 template and use advanced jquery to complete animation.
  • We added video to the landing page background, and managed it by using the backend.
  • In Zone 1, we added animation to include various elements to create moving ships, a rotating windmill fan and dredge.
  • We made sure that every element had a blinking dot that, when clicked, opens a pop-up box to describing the element. The pop-up open action was animated bottom up, and the pop-up close action was animated top to bottom.
  • We included animation between each of the zones.

Final Result with URL


 

Other Case Study